<template>
<view class="page"> 
	<template v-if="isLogin"> 
		<view class="body">
			<view class="list-wrap">
				
				<template v-if="loadingState.default">
					<loading :loadingState="loadingState"></loading>
				</template>
				
				<template v-else>
					<template v-if="list.length>0"> 		 
						<view class="item" v-for="(item,index) in list" :key="index">
							<view class="pic">
								<image v-if="item.last_update_time && item.discern" :src="'https://shibie.honghuoyi.com/image/sb-image.do?path='+item.file_path" mode="widthFix"></image>
								<image v-else :src="'https://shibie.honghuoyi.com/image/image.do?path='+item.file_path" mode="widthFix"></image>
							</view>
							<view class="info">
								<view class="name">{{item.create_time}}</view>
								<view v-if="item.discern" class="pestInfo"> 
									蚁巢数量：<text class="f-red f-wb">{{item.pest_result_arr.length}}</text>	
								</view>
								<view v-else class="pestInfo">未识别到蚁巢</view>
								<view  class="preview-btn">									
									<view v-if="!item.last_update_time && !item.discern" class="del m-r2" @click="delPic(item.id)">删除图片</view>
									<view class="preview" @click="previewPic(item.file_path)">查看大图</view>
								</view> 
							</view>
						</view> 
						
						<loading :loadingState="loadingState"></loading>
					</template>
					<template v-else>
						<empty msg="暂无信息"></empty>
					</template>
					
				</template>
				 
				
			</view>
		</view> 
	</template>
	  
</view>
</template>

<script> 
import loading from '@/components/loading-more.vue'
import empty from '@/components/empty.vue'
import {HTTP_REQUEST_URL} from '@/config.js'
import { 
		previewImage 
	} from '@/common/util.js'
export default{
	name:'demo',
	data(){
		return{ 
			isLogin:false,
			userInfo:uni.getStorageSync('userInfo'),
			loadingState:{
				default:true,
				loading:false,
				completed:false
			}, 
			list:[],			 
			page:1,
			total:0 
		}
	},
	onShow() {
		
	},
	onReachBottom(){
		if(this.loadingState.completed){ 
			this.page=1;
			return false
		}else{
			this.page++;
			this.getUserSbYcList(); 
			if(this.list.length<this.total&&this.list.length>0){
				this.page++; 
				this.getUserSbYcList(); 
			} 
		}	 
	},
	async onLoad(params) {  
		
		this.isLogin=await this.$loginState('check');  
		if(this.isLogin){ 
			this.getUserSbYcList();
		}
		
	},
	methods:{
		
		dataInit:function(){
			this.loadingState={
				default:true,
				loading:false,
				completed:false
			};  
			this.list=[];
			this.total=0;
			this.page=1;
		},
		
		// 获取列表
		getUserSbYcList:async function(){
			let t_res=await this.$api.user_api.getToken({
				appid:'100002',
				appsecret:'24dcb652ce0043c9a53d90de2468b5b8'
			})  
			if(t_res.data.ret==1000){
				let res=await this.$api.pro_api.userSbYc({
					appid:'100002',
					uid: this.userInfo.id,
					token:t_res.data.data.token,
					page: this.page,
					limit:10 
				})      
				console.log(res)
				if(res.data.ret==1000){
					this.loadingState.default=false; 
					this.loadingState.loading=true; 
					if(res.data.data){
						let reg1 = /["]/ig; // 去掉 "
						res.data.data.forEach(item=>{
							if(item.discern){
								item.pest_result_arr=eval(item.discern.replace(reg1, "")); 
							}						
						}) 
						this.list=this.list.concat(res.data.data);					
						 
					}else{
						this.loadingState.loading=false;
						this.loadingState.completed=true;
					}
					
					 
				}else{
					this.loadingState.default=false;
				}
			}
		},
		
		// 删除图片
		delPic:async function(id){
			let _this=this;
			uni.showModal({
				content:"确定删除该图片吗？",
				mask:true,
				async success(m_res) {
					if(m_res.confirm){
						let t_res=await _this.$api.user_api.getToken({
							appid:'100002',
							appsecret:'24dcb652ce0043c9a53d90de2468b5b8'
						})  
						if(t_res.data.ret==1000){
							let res=await _this.$api.pro_api.delShibieImage({
								appid:'100002',
								uid: _this.userInfo.id,
								id:id,
								token:t_res.data.data.token, 
							})      
							console.log(res)
							if(res.data.ret==1000){
								uni.showToast({
									icon:'success',
									title:'删除成功',
									mask:true,
									success() {
										_this.dataInit();
										_this.getUserSbYcList();
									}
								}) 
							}else{
								uni.showToast({
									icon:'error',
									title:res.data.message,
									mask:true,
									duration:1000,
									success() { 
									}
								})  
							}
						}
					}
				}
			})
			
		},
		
		// 预览结果图片
		previewPic: function(path) {
			let _this = this; 	 
			previewImage({
				data: ['https://shibie.honghuoyi.com/image/sb-image.do?path='+path],
				index: 0
			})
		},
		 
	},
	computed:{
		 
	},
	watch:{
		 
	},
	components:{
		loading,
		empty
	}
}
</script>

<style scoped lang="less">
	.list-wrap{
		padding-top: 20rpx;
		.item{ 
			display: flex;
			padding:20rpx;
			margin-bottom: 20rpx;
			background:#fff;
			.pic{
				display: flex;
				align-items: center;
				justify-content: center;
				width:30%;
				max-height: 200rpx;
				margin-right: 20rpx;
				flex-shrink: 0;
				overflow: hidden;
				image{
					width: 100%;
				}
			}
			.info{  
				flex-grow: 2;
				.name{
					margin-bottom: 20rpx;
					font-size: 30rpx;
				}
				.pestInfo{
					display: flex;
					margin-bottom: 30rpx;
					font-size: 28rpx;
					color:#666;
				}
				.preview-btn{
					display: flex;
					justify-content: flex-end;					
					.preview,.del{
						width: 140rpx;						
						font-size: 30rpx;
						border-radius: 8rpx;
						color:#fff;
						text-align: center;
					}
					.preview{
						background: #f00;
					}
					.del{
						background: #09f;
					}
				}
				
			}
		}
	}
	 
</style>
